<template>
	<view class="">
		<view class="pull-img" :style="{height:heig+'px'}">
			<image src="../static/img/config/bull-bg1.png" alt="" :style="{height:isActive==false?'185upx':'250upx',zIndex:isActive!=false?'-10':'0'}"></image>
		</view>

		<view class="bg_gradient-in">
			<image src="../static/img/config/arrows.png" alt="" :style="{width:'25upx',height:'42upx'}" class="arrows" @click="hanleBack">
			<view class="m-title">
				{{title}}
			</view>
		</view>	
	</view>
</template>

<script>
	export default {
		name:"custom-title",
		props:{
			title:{
				default:'详情',
			},
			isActive:{
				default:false
			}
		},
		data() {
			return {
				heig:10,
			};
		},
		mounted() {
			uni.getSystemInfo({
			success:res=>{
				this.heig=Number(res.statusBarHeight)
			}
			})
		},
		methods: {
			hanleBack(){
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.pull-img{
		width: 100%;
		border-radius: 0 0 30upx 30upx;
		// background: url('../../../static/img/config/bull-bg.png') no-repeat ;
		image{
			width: 100%;
			height:185upx;
			border-radius: 0 0 30upx 30upx;
		}
	}
	.m-title{
		
		position: absolute;
		bottom: 0upx;
		left: 50%;
		width: 180upx;
		margin-left: -90upx;
	}
	.arrows{
		position: absolute;
		left: 28upx;
		bottom: 25upx;
	}

.bg_gradient-in {
	position: relative;
	color: white;
	z-index: 999;
	text-align: center;
  margin-bottom: 20upx;
	line-height: 90upx;
	height: 90upx;
	font-size: 36upx;
	width: 100%;
}
</style>